<template>
  <div>
    <div class="block">
      <el-pagination
        style="margin-left: -10px; margin-top: 6px; margin-bottom: -14px"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="10"
        layout="sizes, prev, pager, next"
        :total="totalNumber"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  components: {},

  data() {
    return {
      start: 1,
      limit: 10,
    };
  },

  created() {},

  mounted() {},
  props: ["totalNumber"],
  methods: {
    // 切换每页显示多少个
    handleSizeChange(e) {
      console.log(e);
      this.limit = e;
      this.$emit("limitfather", this.limit);
    },
    // 切换页码
    handleCurrentChange(e) {
      console.log(e);
      this.start = e;
      this.$emit("startfather", this.start);
    },
  },

  computed: {},

  watch: {},
};
</script>

<style scoped lang='scss'>
</style>